<%@ page contentType="text/html;charset=UTF-8"%>
<%@ include file="/WEB-INF/views/include/taglib.jsp"%>
<html>
<head>
	<title>课程事件表管理</title>
	<meta name="decorator" content="default" />
	<style>
		.startclass-mask{
			display: none;
			position: fixed;
			top:0;
			left:0;
			width: 100%;
			height: 100%;
			background: rgba(0,0,0,.7);
			filter:alpha(opacity=70);
		}
		.startclass{
			position: absolute;
			width: 38%;
			left:30%;
			top:22%;
			background: #fff;
			color: #333;
			border-radius: 10px;
			padding: 2% 1%;
			text-align: center;
		}
		.startclass input{
			width: 80%;
			height: 30px;
			line-height:30px;
			text-indent: 12px;
			display: block;
			margin:20px auto;
		}
		.startclass .sub{
			line-height: 20px;
			width: 70px;
			float: right;
			margin-right: 9%;
			padding: 0;
			text-indent: 0;
		}
		.startclass span{
			position: absolute;
			right:20px;
			top:20px;
			font-size: 26px;
			cursor: pointer;
		}
	</style>
	<script type="text/javascript">
        function page(n, s) {
            $("#pageNo").val(n);
            $("#pageSize").val(s);
            $("#searchForm").submit();
            return false;
        }
        function beginshangke() {
            var semesterId=$("#semesterIdId").val();
            if (semesterId.length==0){
                alert("请选择学期号");
                return ;
            }
			$('#kaishishangke').show();
        }
        function closebeginshangke() {
            $('#kaishishangke').hide();
        }
        function kaishishangke() {
			// 先要获取到两个输入框的值 然后进行校验如果为空的话  提示输入房间号或者密码
			var content =$("#content").val();
			var  time=$("#time").val();
			if(content.length==0){
			    alert("请先输入通知内容");
			    return;
			}

            if(time.length==0){
                alert("请先开课时间");
                return ;
            }
			// 如果校验通过 那么就直接提交到后台
            var url = "${pageContext.request.contextPath}/admin/business/event/kaishishangke";
            var param={"content":content,"time":time,"semesterId":$("#semesterIdId").val()};
            $.ajax(url,{
                "type":"post",
                "async":false,
                "data":param,
                "dataType":"json",
                "success":function(data){
                  // 关掉弹窗
                    $('#kaishishangke').hide();
                    alert("发送通知成功")
                }
            });
        }

        function kkyebtn() {
            var semesterId=$("#semesterIdId").val();
            if (semesterId.length==0){
                alert("请选择学期号");
                return ;
            }
            $('#kaikeyugao').show();
        }
        function clokkyg() {
            $('#kaikeyugao').hide();
        }
        function kkyg(){
            var  time=$("#time2").val();
            var semesterId=$("#semesterIdId").val();
            if(time.length==0){
                alert("请先开课时间");
                return ;
            }
            if (semesterId.length==0){
                alert("请选择学期号");
                return false;
            }
            var url = "${pageContext.request.contextPath}/admin/business/event/kechengyugao";
            var param={"time":time,"semesterId":semesterId};
            $.ajax(url,{
                "type":"post",
                "async":false,
                "data":param,
                "dataType":"json",
                "success":function(data){
                    // 关掉弹窗
                    clokkyg();
                    // 清空输入框
                    $("#time2").val("");
                    alert("发送通知成功")
                }
            });
		}
	</script>
</head>
<body>
<ul class="nav nav-tabs">
	<li class="active"><a href="${ctx}/business/event/list2">课程事件表列表</a></li>
</ul>
<form:form id="searchForm" modelAttribute="event"
		   action="${ctx}/business/event/list2" method="post" class="breadcrumb form-search">
	<input id="pageNo" name="pageNo" type="hidden" value="${page.pageNo}" />
	<input id="pageSize" name="pageSize" type="hidden"
		   value="${page.pageSize}" />
	<label>学期  ：</label>
	<tags:pageselect id="semesterId" name="semesterId" value="${semesterId}" labelName="semesterName"
					 labelValue="${semesterName}"
					 title="学期" url="/business/semester/select" width="800" height="540" cssClass="required" allowClear="true"/>
	&nbsp;
	&nbsp;<input id="btnSubmit" class="btn btn-primary" type="submit"
	value="查询" />
	<input  id="button" class="btn btn-primary"  onclick="beginshangke()"  value="开始上课" style="width: 60px;float: right;">
	<input  id="button" class="btn btn-primary"  onclick="kkyebtn()"  value="课程预告" style="width: 60px;float: right;margin-right: 10px;">
</form:form>
<tags:message content="${message}" />
<table id="contentTable" class="table table-striped table-bordered table-condensed">
	<thead>
	<tr>
		<th>ID</th>
		<th>事件名称</th>
		<th>事件类型</th>
		<th>开始时间</th>
		<th>结束时间</th>
		<th>状态</th>
		<shiro:hasPermission name="business:event:edit">
			<th>操作</th>
		</shiro:hasPermission>
	</tr>
	</thead>
	<tbody>
	<c:forEach items="${page.list}" var="event">
		<tr id="${event.id}">
			<td><a href="${ctx}/business/event/form?id=${event.id}">${event.id}</a></td>
			<td>${event.name}</td>
			<td>${dic:getLabelByValue(event.type, 'event_type')}</td>
			<td>${event.startTime}</td>
			<td>${event.endTime}</td>
			<td>${dic:getLabelByValue(event.status,"event_status")}</td>
			<shiro:hasPermission name="business:event:begin">
				<td>
					<%--<a href="${ctx}/business/event/begin?id=${event.id}&semesterId=5" onclick="return confirmx('确认要开始吗？', this.href)">开始</a>
					<a href="${ctx}/business/event/end?id=${event.id}">结束</a>--%>
					<a href="javascript:;" onclick="bbegin('${event.id}')">开始</a>
					<a href="javascript:;" onclick="eend('${event.id}')">结束</a>
				</td>
			</shiro:hasPermission>
			<script>
				function  bbegin(eventId){
				    var semesterId=$('#semesterIdId').val();
                    if (semesterId.length==0){
                        alert("请选择学期号");
						return false;
					}
				    window.location='${ctx}/business/event/begin?id='+eventId+'&semesterId='+semesterId;
                    loading('正在提交，请稍等...');
				}
				function eend(eventId){
                    var semesterId=$('#semesterIdId').val();
                    if (semesterId.length==0){
                        alert("请选择学期号");
                        return false;
                    }
                    window.location='${ctx}/business/event/end?id='+eventId+'&semesterId='+semesterId;
                    loading('正在提交，请稍等...');
				}
			</script>
		</tr>
	</c:forEach>
	</tbody>
</table>
<div class="pagination">${page}</div>

<%--开始上课弹出框--%>
<div id="kaishishangke" class="startclass-mask">
	<div class="startclass">
		<input type="text" placeholder="请输通知内容" id="content">
		<input type="time" placeholder="上课时间2017年5月30日下午6点" id="time">
		<input type="submit" value="提交" onclick="kaishishangke()" class="sub btn btn-primary">
		<span  onclick="closebeginshangke()">X</span>
	</div>
</div>

<div id ="kaikeyugao" class="startclass-mask">
	<div class="startclass">
		<input type="text" placeholder="上课时间" id="time2">
		<input type="submit" value="提交" onclick="kkyg()" class="sub btn btn-primary">
		<span  onclick="clokkyg()">X</span>
	</div>
</div>
</body>
</html>